@using OrchardCore.ContentManagement
@using OrchardCore.Flows.Models
@using System.Globalization
@using StatCan.OrchardCore.VueForms.Models
@inject OrchardCore.ContentManagement.Display.IContentItemDisplayManager ContentItemDisplayManager
@inject OrchardCore.DisplayManagement.ModelBinding.IUpdateModelAccessor updateModelAccessor

@{
  var contentItem = ((ContentItem)Model.ContentItem);
  var formPart = contentItem.As<VueForm>();
  var flowPart = contentItem.As<FlowPart>();
  var scripts = contentItem.As<VueFormScripts>();

  var initScript = await Orchard.LiquidShortcodesAsync(scripts.ClientInit?.Text, contentItem);
  var options = await Orchard.LiquidShortcodesAsync(scripts.ComponentOptions?.Text, contentItem);

  var componentName = "c-" + Guid.NewGuid().ToString("N");
}
<style asp-name="vue-forms"></style>
<script asp-name="vue-forms" at="Foot"></script>

<div class="vue-form" data-name="@componentName" data-init-script="@Orchard.B64Encode(initScript)" data-options="@Orchard.B64Encode(options)" data-lang="@CultureInfo.CurrentUICulture.TwoLetterISOLanguageName">
  @Tag(Model, componentName)
</div>
<script at="Foot" type="text/html" id="@componentName">
  <validation-observer ref="obs" slim v-slot="obs">
    <form v-cloak
          ref="form"
          id="@formPart.ContentItem.ContentItemId"
          v-on:submit.prevent="handleSubmit"
          action="@Url.Action("Submit", "VueForm", new {area="StatCan.OrchardCore.VueForms" , formId=contentItem.ContentItemId })"
          method="post"
          novalidate>
      @Html.AntiForgeryToken()
      @foreach (var widget in flowPart.Widgets)
      {
        var widgetContent = await ContentItemDisplayManager.BuildDisplayAsync(widget, updateModelAccessor.ModelUpdater);
        // Properties come from the widget that displays the forms.
        // This allows a page where the form is rendered to pass a value down to the form so it can be dynamically preloaded with data
        foreach (var prop in ((IShape)Model).Properties)
        {
          if (!widgetContent.Properties.ContainsKey(prop.Key))
          {
            widgetContent.Properties.Add(prop.Key, prop.Value);
          }
        }
        @await DisplayAsync(widgetContent)
      }
      </form>
  </validation-observer>
</script>
